<template>
    <div>
        <el-form label-width="120px" :model="AUFinanceInvoice" ref="AUFinanceInvoiceref" :rules="rules">
            <el-row>
                <el-col :offset="2" :span="9">
                    <el-form-item label="申请人" prop="ApplyUserId">
                        <el-select width="100%" v-model="AUFinanceInvoice.ApplyUserId" filterable placeholder="请选择请款人" style="width:100%">
                            <el-option value="">请选择申请人</el-option>
                            <el-option value=" ">全部</el-option>
                            <el-option v-for="(v,k) in AllUsers" :value="v.Id" :data-userid="v.Id" :label="v.UserName" v-text="v.UserName" />
                        </el-select>
                    </el-form-item>
                </el-col>

                <el-col :offset="2" :span="9">
                    <el-form-item label="部门"  prop="DepartmentId">
                        <el-select v-model="AUFinanceInvoice.DepartmentId" filterable placeholder="请选择部门" style="width:100%">
                            <el-option value="">请选择部门</el-option>
                            <el-option value=" ">全部</el-option>
                            <el-option v-for="(v,k) in AllDepartment" :value="v.Id" :data-userid="v.Id" :label="v.DepartmentName" v-text="v.DepartmentName" />
                        </el-select>
                    </el-form-item>
                </el-col>


            </el-row>

            <el-row>
                <el-col :offset="2" :span="9">
                    <el-form-item label="项目"  prop="ProjectId">
                        <el-select v-model="AUFinanceInvoice.ProjectId" filterable placeholder="请选择项目" style="width: 100%">
                            <el-option value="">请选择项目</el-option>
                            <el-option value=" ">全部</el-option>
                            <el-option v-for="(v,k) in AllProject" :value="v.Id" :data-userid="v.Id" :label="v.ProjectName" v-text="v.ProjectName" />
                        </el-select>
                    </el-form-item>
                </el-col>

                <el-col :offset="2" :span="9">
                    <el-form-item label="发票类别" prop="InvoiceType">
                        <el-select width="100%" v-model="AUFinanceInvoice.InvoiceType" filterable placeholder="请选择类型" style="width:100%">
                            <el-option label="增值税专用发票" :value="1"></el-option>
                            <el-option label="增值税普通发票" :value="2"></el-option>
                        </el-select>
                    </el-form-item>
                </el-col>

            </el-row>


            <el-row>
                <el-col :offset="2" :span="9">
                    <el-form-item label="甲方单位">
                        <el-select v-model="AUFinanceInvoice.CunstomerId" filterable placeholder="请选择甲方单位" style="width: 100%">
                            <el-option value="">请选择甲方单位</el-option>
                            <el-option value=" ">全部</el-option>
                            <el-option v-for="(v,k) in AllCustomer" :value="v.Id" :data-userid="v.Id" :label="v.CustomerCompany"/>
                        </el-select>
                    </el-form-item>
                </el-col>

                <el-col :offset="2" :span="9">
                    <el-form-item label="联系人" prop="ContactUser">
                        <el-input type="text" v-model="AUFinanceInvoice.ContactUser"></el-input>
                    </el-form-item>
                </el-col>
            </el-row>


            <el-row>
                <el-col :offset="2" :span="9">
                    <el-form-item label="开票内容" prop="Content">
                        <el-input type="text" v-model="AUFinanceInvoice.Content"></el-input>
                    </el-form-item>
                </el-col>

                <el-col :offset="2" :span="9">
                    <el-form-item label="规格">
                        <el-input type="text" v-model="AUFinanceInvoice.Model"></el-input>
                    </el-form-item>
                </el-col>
            </el-row>

            <el-row>
                <el-col :offset="2" :span="9">
                    <el-form-item label="单位">
                        <el-input type="text" v-model="AUFinanceInvoice.Unit"></el-input>
                    </el-form-item>
                </el-col>

                <el-col :offset="2" :span="9">
                    <el-form-item label="数量">
                        <el-input type="text" v-model="AUFinanceInvoice.Amount"></el-input>
                    </el-form-item>
                </el-col>
            </el-row>

            <el-row>
                <el-col :offset="2" :span="9">
                    <el-form-item label="单价">
                        <el-input type="text" v-model="AUFinanceInvoice.Price"></el-input>
                    </el-form-item>
                </el-col>
            </el-row>

            <el-row>
                <el-col :offset="2" :span="9">
                    <el-form-item label="金额" prop="TotalPrice">
                        <el-input type="text" v-model="AUFinanceInvoice.TotalPrice"></el-input>
                    </el-form-item>
                </el-col>

                <el-col :offset="2" :span="9">
                    <el-form-item label="税率（%）" prop="TaxRate">
                        <el-input type="text" v-model="AUFinanceInvoice.TaxRate"></el-input>
                    </el-form-item>
                </el-col>
            </el-row>


            <el-row>
                <el-col>
                    <el-form-item label="发票备注">
                        <el-input v-model="AUFinanceInvoice.InvoiceRemark" type="textarea" class="resizeNone"></el-input>
                    </el-form-item>
                </el-col>
            </el-row>

            <el-row>
                <el-col>
                    <el-form-item label="合同总额及支付阶段说明">
                        <el-input type="text" v-model="AUFinanceInvoice.Remark"></el-input>
                    </el-form-item>
                </el-col>
            </el-row>

            <el-row>
                <el-col>
                    <el-form-item label="图片上传">
                        <el-image v-for="item in imgArray" :src="item" style="height: 146px;width:146px;padding: 0px 3px" :z-index="3000" :preview-src-list="imgArray"></el-image>
                        <upload-file ref="upload_file_refs" style="display: inline-block;margin-right: 10px;display: block"
                                     content="图片选择"
                                     list_type="picture-card"
                                     btnsize=""
                                     :another-data="AnotherData"
                                     :showfilelist="true"
                                    >
                        </upload-file>
                    </el-form-item>
                </el-col>
            </el-row>

            <el-row>
                <el-col style="text-align: center">
                    <el-button type="primary" @click="SaveFinance">提交</el-button>
                </el-col>
            </el-row>

        </el-form>
    </div>
</template>
<script>
    import * as publicjs from "/public/Scriput/Public"
    import UploadFile from "../../UploadFile";

    export default {
        components: {
            "upload-file": UploadFile,
        },
        name: 'AUFinanceInvoice',
        props: {
            AllUsers: {
                type: Array,
                required: true
            },
            AllDepartment: {
                type: Array,
                required: true
            },
            AllProject: {
                type: Array,
                required: true
            },
            AllCustomer: {
                type: Array,
                required: true
            },

            AUFinanceInvoice: {
                type: Object,
                required: true
            }
        },
        data() {
            var demicalcheck=(rule, value, callback)=>{
                if (!value){
                    return callback(new Error('不能为空'));
                }else{
                    let pattern = /^[0-9]+([.]{1}[0-9]+){0,1}$/;
                    if (pattern.test(value)) {
                        callback();
                    } else {
                        callback(new Error('必须数字'));
                    }
                }
            }
            return {
                imgArray: [],
                //文件上传参数
                AnotherData: {
                    FileType: 1024,
                    id: 1,
                    Type: 0,
                    Single: false,
                },
                rules:{
                    TotalPrice:[{ validator: demicalcheck, trigger: 'blur' }],
                    TaxRate:[{ validator: demicalcheck, trigger: 'blur' }],
                    ApplyUserId:[ { required: true, message: '请选择申请人', trigger: 'change' } ],
                    DepartmentId:[ { required: true, message: '请选择部门', trigger: 'change' } ],
                    ProjectId:[ { required: true, message: '请选择项目', trigger: 'change' } ],
                    InvoiceType:[ { required: true, message: '请选择发票类别', trigger: 'change' } ],
                    ContactUser:[ { required: true, message: '请输入联系人', trigger: 'blur' } ],
                    Content:[ { required: true, message: '请输入开票类容', trigger: 'blur' } ],
                },
            }
        },
        methods: {
            SaveFinance() {
                this.$refs["AUFinanceInvoiceref"].validate(vali=>{
                    if (vali){
                        let loadding = this.openLoading();
                        this.$http.post("/Finance/AddFinanceInvoice", { AUFinanceInvoice: this.AUFinanceInvoice }).then(result => {
                            loadding.close();
                            if (result.data.bit) {
                                var Id = result.data.Id;
                                this.$message.success("开票单添加成功")
                                if (this.$refs['upload_file_refs'].fileList.length > 0) {
                                    this.AnotherData.id = Id;
                                    this.$refs['upload_file_refs'].submitUpload()
                                }
                                this.$parent.$parent.AUFinanceInvoiceShow = false;
                                this.$parent.$parent.GetFinanceInvoiceDetail();
                            }
                            else {
                                this.$message.error("开票单添加失败")
                            }
                        });
                    }
                })
            },
        },
    }
</script>
<style scoped>
</style>
